<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    省:
    <select id="province">
        <option value="bj">北京市</option>
        <option value="tj">天津市</option>
        <option value="sh">上海市</option>
        <option value="cq">重庆市</option>
        <option value="sc">四川省</option>
        <option value="gd">广东省</option>
    </select>
    市：
    <select id="city"></select>
    <p >
        //插件描述：地区三级联动<br>
        // 获取要操作的元素
    </p>
    <script>
        var p = document.querySelector('p');
        p.oncopy=  function(){
            alert('本网站的内容均有版权请不要复制')
            return false; // 禁止复制
        }
        document.onselectstart = function(){
            //alert('你是否要选中文字呢？')//
            return false;// 禁止选中
        };
        p.oncontextmenu = function(){
            alert('不要用右键点击我')
            return false; // 禁止右键菜单
        }
        //插件描述：地区三级联动
        // 获取要操作的元素
        var province = document.querySelector('#province');
        var city = document.querySelector('#city');
        // 省份的值发生改变时的处理函数
        function provinceChange() {
            //处理联动操作
            var pValue = province.value;//获取到当前选择的省份
            if (pValue == 'gd') { // 选中了广东
                // 最好不要在这里直接操作城市的select
                setCity(['广州','深圳','中三','佛山']);
            }else if (pValue == 'bj') { // 选中了背景
                // 最好不要在这里直接操作城市的select
                setCity(['东城区','朝阳区']);
            }
        }
        // 设置城市下拉列表框
        function setCity(cityNames) {
            // 清除旧的可选项
            city.innerHTML = '';//直接将所有的内容清空 -- 删除所有的子元素

            for (var i = 0; i < cityNames.length; i++) {
                var c = cityNames[i]; // 获取到城市
                var option = document.createElement('option');
                option.innerHTML = c;
                option.value = c;
                city.appendChild(option);
            }
        }
        // 绑定处理函数
        province.onchange = provinceChange;
        // 直接调用一次省份的改变
        provinceChange();

    </script>
</body>

</html>